<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>koa-file-server</title>
    <style>
      .info-container {
        box-sizing: content-box;
        /* width: 100%; */
        margin: 20px auto;
        padding: 20px;
        border: 1px solid #eee;
        border-radius: 8px;
      }
      #infoContent {
        font-family: "Microsoft YaHei", sans-serif;
        line-height: 1.6;
        color: #333;
        white-space: pre-wrap; /* 保留原始空格（如多个连续空格） */
      }
    </style>
  </head>
  <body>
    <div class="info-container">
      <div id="infoContent"></div>
    </div>
    <script>
      // getList()
      function getList(params) {
        fetch("https://localhost:3000/api/user/getUserList", {
          body: JSON.stringify({
            page: 1,
            pageSize: 5,
          }),
          headers: {
            "content-type": "application/json",
          },
          method: "POST",
        })
          .then((rsp) => rsp.json())
          .then((rsp) => {
            console.log("rsp", rsp);
            const { code, data } = rsp;
            if (code === "00") {
              let str = "";
              for (let item of data) {
                str += item.content;
              }
              const formattedStr = str.replace(/\r\n/g, "<br>");
              // document.querySelector("#app").innerHTML = str;

              // 插入到 div 中（使用 innerHTML 解析 <br> 标签）
              document.getElementById("infoContent").innerHTML = formattedStr;
            }
          });
      }

      fetch("https://localhost:3000/city.json")
        .then((rsp) => rsp.json())
        .then((rsp) => {
          console.log("rsp", rsp);
          const start = performance.now();
          const datas = rsp.map((item) => {
            const children = item.city?.map((_item) => {
              const children = _item.area.map((citem) => {
                return {
                  text: citem.name,
                  code: citem.code,
                };
              });
              return {
                text: _item.name,
                code: _item.code,
                children,
              };
            });
            return {
              text: item.name,
              code: item.code,
              children,
            };
          });
          const end = performance.now();
          console.log("耗时：", end - start, datas);
        });
    </script>
  </body>
</html>
